<template>
  <div>
    <ul style="height:650px;padding:0px">
      <li v-for="(i,index) in detail.recentAndCommentDtos"
          style="padding:10px;list-style-type:none;border-left:solid 1px #65a9e5;border-top:solid 1px #65a9e5;border-right:solid 1px #65a9e5"
          :key="index">
        <el-avatar :size="35"
                   :src="detail.image"></el-avatar>
        <label for="">{{detail.account}}</label>
        <br>
        <img :src="i.image"
             style="height:300px"
             alt="">
        <p>{{i.content}}</p>
        <label>{{i.time}}</label>
        <div align="right">
          <el-badge :value="i.aggreenum"
                    class="item">
            <i class="el-icon-thumb">点赞</i>
          </el-badge>
          <el-badge :value="i.commentnum"
                    class="item">
            <i class="el-icon-chat-line-round"
               @click="comment(i.recentCommentDtos)">
              <span>评论</span>
            </i>
          </el-badge>
        </div>
        <div align="right">
          <br>
          <el-button type="danger"
                     size="mini"
                     @click="delrecent(i)">删除</el-button>
        </div>
      </li>
    </ul>
  </div>
</template>
<script>
import http from '../../../../axios_config'

export default {
  props: {
    detail: {},
  },
  data () {
    return {
      comments: [],
    }
  },
  methods: {
    //查看评论
    comment (commentList) {
      if (commentList.length > 0) {
        http.get("http://192.168.11.18:8080/recentcomment/findComments?id=" + commentList[0].rid)
          .then(res => {
            console.log(res.data);
            let recentComment = res.data.data;
            this.$emit("showComment", { data: recentComment })
          });
      } else {
        this.$message('该条动态暂时没有评论！！');
        this.$emit("showComment", { data: {} })
      }
    },
    //删除动态
    delrecent (i) {
      console.log(i);//动态id为 i.id
      http.get("http://192.168.11.18:8080/recent/deleterecent?id=" + i.id)
        .then(res => {
          console.log(res.data);
          if (res.data.statusCode == 200) {
            this.$notify({
              title: '删除成功',
              message: '该动态已成功删除！',
              type: 'success'
            });
            for (let j = 0; j < this.detail.recentAndCommentDtos.length; j++) {
              if (this.detail.recentAndCommentDtos[j].id = i.id) {
                this.detail.recentAndCommentDtos.splice(j, 1);
                return true
              }
            }
          }

        });
    },
  },
  mounted () {
    console.log(this.detail);
  }

}
</script>

<style scoped>
</style>